﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="businfo.aspx.cs" Inherits="businfo" %>
<!DOCTYPE >
<html >
<head >
    <title>樂點公車即時資訊服務</title>
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<style type="text/css">
  html { height: 100%;width:100% ;max-width:320px; min-width:320px }
  body { height: 100%;width:100% ;margin: 0px; padding: 0px ; max-width:320px;  min-width:320px}
  #list_canvas { height: 100% ;max-width:320px;  min-width:320px}
</style>

  <script type="text/ecmascript" src="js/jquery-1.7.1.min.js"></script>
  <script type="text/ecmascript" src="js/jquery.mobile-1.1.0.min.js"></script>
  <script type="text/ecmascript" src="js/bus.js"></script>
  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
  <script type="text/ecmascript" src="js/map.js"></script>
  <link rel="stylesheet" href="css/jquery.mobile-1.1.0.min.css" />
  <link type="text/css" rel="stylesheet" href="css/style.css"/>
  <link type="text/css" rel="stylesheet" href="css/bus.css"/>
  <script type="text/ecmascript" src="js/jquery.alerts.js"></script>
  <link type="text/css" rel="stylesheet" href="css/jquery.alerts.css"/>
  <script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-34126365-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</head>
<body >

<div data-role="page" id="chatpage">

<div data-id="header" id="heaer" data-role="header" data-position="fixed" style="position:fixed;" >
	<div class="bg">
	    <div class="head_bar" id="chatpage_head_bar">
	    <ul>
	    </ul>
		</div>
	</div>
    <!--<div id="msg">
    <span id="route_Name">207</span>
    <marquee direction="up" loop="true"  scrollamount="1" height="18px" style=" float:right">
    <span id="weather"></span><br />
    <span id="alertStop"></span><span id="estimateTime"></span>
    </marquee>
    </div>
    <div id="dock-top" class="dock">
        <img  width="43" height="41" src="res/img/alarm.png" />
    </div>-->
</div><!-- /header -->

  
<div id="stop_alert_list"></div>

<div id="content" data-role="content">
	<div class="arrow"><img src="icon/arrow.png" border="0" /></div>
	<div id="StopList"></div>
</div>

<div data-id="footer" data-role="footer" data-position="fixed" style="position:fixed;" >
	<div id="dock-bottom" class="dock">
	</div>

	<div id="menu" data-role="navbar">
		<ul class="menu-items">
			<li class="menu-item first">
				<a href='info.aspx?rtid=<%=Request.Cookies["JoySpots"].Values["rtid"]%>&busid=<%=Request.Cookies["JoySpots"].Values["busid"]%>&city=<%=Request.Cookies["JoySpots"].Values["city"] %>&gob=<%=Request.Cookies["JoySpots"].Values["gob"] %>'><img src="icon/nav1.png"/><br /><span style="color:#000;font-weight:bold;">公告訊息</span></a>
			</li>
			<li class="menu-item">
				<a href='joychat.aspx?rtid=<%=Request.Cookies["JoySpots"].Values["rtid"]%>&busid=<%=Request.Cookies["JoySpots"].Values["busid"]%>'><img src="icon/nav2.png"/><br /><span style="color:#000;font-weight:bold;">公車踹共</span></a>
			</li>
			<li class="menu-item">
				<a href="#chatpage"><img src="icon/nav3.png"/><br /><span style="color:#000;font-weight:bold;">動態資訊</span></a>
			</li>
			<li class="menu-item last">
			    <a href="javascript:void(0);"><img src="icon/nav4.png"/><br /><span style="color:#000;font-weight:bold;">到站時間</span></a>
				<select name="setstop" id="setstop" onchange="SetEndStop(this)" data-role="none">
                <option value="">不設定</option>
            </select>
			</li>
		</ul>
	</div>
</div>

</div>

<div id="scriptField"></div>
</body>

</html>

<script>
    //get_location();
    var testtmp = null;
    $(document).ready(function() {
        Init('<%=Request.Cookies["JoySpots"].Values["rtid"]%>', '<%=Request.Cookies["JoySpots"].Values["gob"] %>', '<%=Request.Cookies["JoySpots"].Values["city"] %>', '<%=Request.Cookies["JoySpots"].Values["busid"] %>');
        GetStop(RouteId, City, Goto, BusId);
        getNextStop();
    });
    //alert($.mobile.silentScroll);
    $(document).live("pageshow", function(event, prevPage) {
        try {
            var page = $.mobile.activePage.attr("id"); //prevPage.nextPage.attr("id");
            
            thisPage = page;
            if (page != "chatpage") {
                var obj = $("#" + page + " #setstop");
                obj.html($("#setstop").html());
                if (AlarmData != null) {
                    obj.attr("value", document.getElementById("setstop").value)
                }
            }
            else {
                if (RouteId != 0) {
                    //GetStop(RouteId, City, Goto, BusId);
                    //getNextStop();
                    if (prevPage.prevPage.attr("id") == "markerpage")
                        $(".close img").trigger("click");
                }
                //HeaderItem[1] = "";
            }
            header_info();
            switch (page) {
                case "markerpage":
                    get_marker();
                    $(".map_title").html(StopData.name);
                    if (prevPage.prevPage.attr("id") == "chatpage") {
                        $("#map_img").attr("src", "http://maps.googleapis.com/maps/api/streetview?size=250x232&location=" + StopData.lat + ",%20" + StopData.lng + "&heading=0&fov=140&pitch=-10&sensor=false&key=AIzaSyB5ygYaDOar7qCHWLTWPmzh1-XYkoPdXkw");
                        $.superbox.settings = {
                            title: StopData.name,
                            boxId: "superbox", // Id attribute of the "superbox" element
                            boxClasses: "", // Class of the "superbox" element
                            overlayOpacity: .8, // Background opaqueness
                            boxWidth: "298", // Default width of the box
                            boxHeight: "363", // Default height of the box
                            loadTxt: "Loading...", // Loading text
                            closeTxt: "<img src=icon/close.png border=0>", // "Close" button text
                            prevTxt: "Previous", // "Previous" button text
                            nextTxt: "Next" // "Next" button text
                        };
                        $.superbox();
                        $("#" + page + " #superbox").trigger("click");
                    }
                    break;
                case "marker_detailpage":
                    google_initialize2(MarkerObj.lat, MarkerObj.lng, MarkerObj.ico);
                    $("#Marker_Ico").attr("src", "icon/" + MarkerObj.ico + ".png");
                    var rs = MarkerData[MarkerObj.index];
                    $("#Marker_Title").html(rs.name);
                    if (rs.desc != "")
                        $("#Marker_Desc").html("<img src='icon/desc.png' align=absmiddle width=20>&nbsp;" + rs.desc + "<br/>");
                    if (rs.phone != "")
                        $("#Marker_Phone").html("<img src='icon/phone.png' align=absmiddle width=20>&nbsp;<a href='tel:" + rs.phone + "'>+"+rs.phone+"</a><br/>");
                    $("#Marker_Address").html("<img src='icon/address.png' align=absmiddle width=20>&nbsp;" + rs.area + " " + rs.address + "<br/>");
                    $("#Marker_Recommend").html("<img src='icon/information.png' align=absmiddle width=20>&nbsp;" + rs.recommend);
                    $(".map_title").html(StopData.name);
                    if (rs.photo.length >= 2)
                        $("#Marker_Img").attr("src", rs.photo[1].url);
                    break;
            }
        }
        catch (e) { alert(e.message) }
    })
</script>